<template>
  <div class="HavucheckTree">
    <el-input
      placeholder="输入关键字进行过滤"
      v-model="filterText"
      size="small">
    </el-input>
    <div class="treebox">
      <el-tree
        class="filter-tree"
        :data="data"
        show-checkbox
        @check="handClick"
        :props="defaultProps"
        :highlight-current="true"
        :default-checked-keys="checkarr"
        :default-expanded-keys="zhankaiarr"
        node-key="id"
        :filter-node-method="filterNode"
        ref="tree">
      </el-tree>
    </div>
  </div>
</template>

<script>
import {getfuandlibianapi} from '@/api/Microgrid/Statistics/MicPerformance'
export default {
  name: 'CallPoliceHavucheckTree',

  data() {
    return {
      data: [],
      filterText: '',
      defaultProps: {
        children: 'inverterList',
        label: 'name'
      },
      checkarr: [],
      zhankaiarr: [],
    };
  },

  async mounted() {
    const { data: { list } } = await getfuandlibianapi()
    this.data = list
    this.zhankaiarr.push(list[0].id)
    this.checkarr.push(list[0].inverterList[0].id)
    this.chushihualist = [list[0], list[0].inverterList[0]]
    this.$emit('chushihua',this.chushihualist)
  },

  methods: {
    // 树节点点击
    handClick() {
      const array = this.$refs.tree.getCheckedNodes(false, true)
     this.$emit('handClick',array)
    },
    // 树节点过滤
    filterNode(value, data) {
        if (!value) return true;
        return data.name.indexOf(value) !== -1;
      }
  },
  watch: {
      filterText(val) {
        this.$refs.tree.filter(val);
      }
    },
};
</script>

<style scoped>
.HavucheckTree{
  height: 100%;
  .treebox{
    margin-top: 10px;
    height: 95%;
    overflow: auto;
  }
}
</style>